{% extends 'base.html' %}
{% load static %}

{% block title %}{{ title }}{% endblock %}

{% block content %}
<div class="container-fluid py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1 class="h3">{{ title }}</h1>
        <a href="{% url 'test_report_list' %}" class="btn btn-secondary">
            <i class="fas fa-arrow-left"></i> 返回列表
        </a>
    </div>

    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">{{ title }}</h6>
        </div>
        <div class="card-body">
            <form method="post">
                {% csrf_token %}
                
                {% if form.non_field_errors %}
                <div class="alert alert-danger">
                    {% for error in form.non_field_errors %}
                    {{ error }}
                    {% endfor %}
                </div>
                {% endif %}
                
                <div class="mb-3">
                    <label for="{{ form.name.id_for_label }}" class="form-label">{{ form.name.label }}</label>
                    {{ form.name }}
                    {% if form.name.errors %}
                    <div class="invalid-feedback d-block">
                        {% for error in form.name.errors %}
                        {{ error }}
                        {% endfor %}
                    </div>
                    {% endif %}
                </div>
                
                {% if not form.project.is_hidden %}
                <div class="mb-3">
                    <label for="{{ form.project.id_for_label }}" class="form-label">{{ form.project.label }}</label>
                    {{ form.project }}
                    {% if form.project.errors %}
                    <div class="invalid-feedback d-block">
                        {% for error in form.project.errors %}
                        {{ error }}
                        {% endfor %}
                    </div>
                    {% endif %}
                </div>
                {% else %}
                {{ form.project }}
                {% endif %}
                
                <div class="mb-3">
                    <label for="{{ form.report_type.id_for_label }}" class="form-label">{{ form.report_type.label }}</label>
                    {{ form.report_type }}
                    {% if form.report_type.errors %}
                    <div class="invalid-feedback d-block">
                        {% for error in form.report_type.errors %}
                        {{ error }}
                        {% endfor %}
                    </div>
                    {% endif %}
                </div>
                
                <div class="mb-3">
                    <label for="{{ form.test_run.id_for_label }}" class="form-label">{{ form.test_run.label }}</label>
                    {{ form.test_run }}
                    {% if form.test_run.errors %}
                    <div class="invalid-feedback d-block">
                        {% for error in form.test_run.errors %}
                        {{ error }}
                        {% endfor %}
                    </div>
                    {% endif %}
                    <div class="form-text">选择关联的测试运行，系统将自动生成报告内容</div>
                </div>
                
                <div class="mb-3">
                    <label for="{{ form.summary.id_for_label }}" class="form-label">{{ form.summary.label }}</label>
                    {{ form.summary }}
                    {% if form.summary.errors %}
                    <div class="invalid-feedback d-block">
                        {% for error in form.summary.errors %}
                        {{ error }}
                        {% endfor %}
                    </div>
                    {% endif %}
                </div>
                
                <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                    <button type="submit" class="btn btn-primary">
                        <i class="fas fa-save"></i> 保存
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_css %}
<style>
    form input, form select, form textarea {
        width: 100%;
        padding: 0.375rem 0.75rem;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color: #212529;
        background-color: #fff;
        background-clip: padding-box;
        border: 1px solid #ced4da;
        border-radius: 0.25rem;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
    
    form select {
        appearance: auto;
    }
    
    form textarea {
        min-height: 100px;
    }
</style>
{% endblock %}
